.page-login-staff {
  overflow: hidden;
  .login-container {
    width: 500px;
    margin: 50px auto 100px;
    .message-mb {
      text-align: center;
      color: $color-active;
      height: 20px;
    }
    .login-tab {
      @include clearfix();
      margin-bottom: 20px;
      li {
        float: left;
        width: 100%;
        padding: 10px 0;
        text-align: center;
        cursor: pointer;
        span {
          display: inline-block;
          font-size: 20px;
          font-weight: bold;
          &.active {
            border-bottom: 2px solid $color-active;
          }
        }
      }
    }
    .mobile {
      position: absolute;
      font-size: 12px;
      color: $color-invalid;   
      left: 0;
      bottom: -16px;
    }
    .yzm-field {
      @include clearfix();
      .c-yzm {
        float: left;
        width: 60%;
      }
      .c-img {
        float: left;
        width: 40%;
        height: 46px;
        cursor: pointer;
        img {
          vertical-align: middle;
          margin: 0 5px;
          float: left;
          margin-top: 10px;
        }
        span {
          display: inline-block;
          text-align: center;
        }
      }
    }
    .vcode-field {
      @include clearfix();
      .c-vcode {
        float: left;
        width: 60%;
      }
      .c-btnvcode {
        float: left;
        width: 40%;
        height: 40px;
        // padding-left: 5px;
        cursor: pointer;
        img {
          vertical-align: middle;
          margin-left: 5px;
        }
      }
    }
  }

  .license {
    &-info {
      font-size: 14px;
      font-weight: normal;
    }
    &-content {
      color: #095bf4;
    }
  }

  .trust-list {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid $color-border-gray;
    .trust-item {
      display: inline-block;
      vertical-align: middle;
      text-decoration: none;
      color: $color-primary-text;
      text-align: center;
      margin-right: 5px;
      &__img {
        width: 32px;
        height: 32px;
        display: block;
        margin: 0 auto 5px;
      }
    }
  }
  .jump {
    br {
      display: none;
    }
    a {
      font-size: 14px;
      color: #999;
      cursor: pointer;
    }
  }
  .sms-yzm,
  .sms-vcode {
    // .form-item__error-message {
    //   position: absolute;
    //   right: 40.5%;
    // }
  }
  @include respond(sm) {
    min-height: 480px !important;
    .login-container {
      width: 85%;
      margin: 20px auto;
      .login-tab {
        li {
          padding-bottom: 0;
          span {
            font-size: 16px;
          }
        }
      }
      .yzm-field {
        .c-yzm {
          width: 45%;
        }
        .c-img {
          width: 55%;
        }
      }
      .jump {
        br {
          display: block;
        }
        text-align: center;
      }
    }
    .sms-yzm {
      // .form-item__error-message {
      //   right: auto;
      //   left: 0;
      //   bottom: -18px;
      // }
    }
  }
}
